// 成功案例详情页脚本
document.addEventListener('DOMContentLoaded', function() {
    // 获取URL中的案例ID参数
    const urlParams = new URLSearchParams(window.location.search);
    const caseId = urlParams.get('id');
    
    // 如果没有案例ID，显示错误信息
    if (!caseId) {
        showError('未找到案例信息');
        return;
    }
    
    // 加载案例详情
    loadCaseDetail(caseId);
    
    // 初始化页面交互
    initPageInteractions();
});

// 加载案例详情
function loadCaseDetail(caseId) {
    // 在真实应用中，这里应该从服务器获取数据
    // 这里我们使用模拟数据
    setTimeout(() => {
        const caseData = getCaseData(caseId);
        
        // 如果找不到对应的案例数据，显示错误
        if (!caseData) {
            showError('未找到该案例信息');
            return;
        }
        
        // 渲染案例详情
        renderCaseDetail(caseData);
    }, 800);
}

// 获取案例数据（模拟数据）
function getCaseData(caseId) {
    // 模拟的案例数据
    const casesData = {
        'case1': {
            id: 'case1',
            title: '从二本院校到BAT大厂 - 小王的求职逆袭',
            date: '2023-05-15',
            views: 1528,
            user: {
                name: '小王',
                background: '计算机专业',
                avatar: 'https://images.pexels.com/photos/1222271/pexels-photo-1222271.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
                tag: '从普通二本到BAT'
            },
            results: {
                achievement: '成功入职字节跳动',
                salary: '+40%'
            },
            content: `我是一名普通二本院校的计算机专业学生，在大三下学期开始准备校招。当时看到周围的同学都在为BAT等大厂而努力，但我却不知道从何开始，简历投递后石沉大海是常态，几次笔试也都铩羽而归。

就在我感到迷茫之际，通过学长推荐，我联系了张明老师。第一次咨询，张老师就给了我很多实用的建议，并为我制定了详细的求职规划。

接下来的6个月，在张老师的指导下，我完成了从简历优化到技术提升再到面试准备的全过程，最终顺利通过了字节跳动的层层面试，拿到了超出预期的offer，薪资比我预期高出了40%！`,
            process: [
                {
                    title: '简历诊断与优化',
                    description: '张老师帮我重新梳理了项目经历，突出了核心能力点，精简了无关内容，让简历更加吸引眼球。'
                },
                {
                    title: '技术能力提升',
                    description: '根据目标岗位要求，张老师为我制定了技术学习计划，包括算法、系统设计等关键环节，并推荐了高质量的学习资源。'
                },
                {
                    title: '项目实践指导',
                    description: '在张老师建议下，我完成了两个高质量的开源项目，这些项目后来在面试中成为了我的亮点。'
                },
                {
                    title: '面试强化训练',
                    description: '通过模拟面试和针对性练习，我克服了技术面试中的紧张情绪，学会了如何清晰地表达自己的思路。'
                },
                {
                    title: 'Offer谈判指导',
                    description: '拿到offer后，张老师还指导我如何进行薪资谈判，最终使我的薪资提高了10%。'
                }
            ],
            advice: [
                {
                    title: '明确目标，分解路径',
                    description: '大厂求职不是一蹴而就的过程，需要明确阶段性目标，并逐步完成。张老师帮我将求职过程分解为多个小目标，让整个过程更有可控性。'
                },
                {
                    title: '突出差异化优势',
                    description: '作为非名校学生，更需要找到自己的差异化优势。通过深入的自我剖析和有针对性的项目实践，我找到了自己在高性能开发方面的优势。'
                },
                {
                    title: '持续复盘，迭代提升',
                    description: '每次面试后，我都会与张老师一起复盘，找出不足并迅速调整。这种持续迭代的过程帮助我在短时间内取得了显著进步。'
                }
            ],
            agent: {
                id: 'agent1',
                name: '张明',
                title: '前BAT高级HR',
                avatar: 'https://images.pexels.com/photos/3760263/pexels-photo-3760263.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
                description: '拥有10年互联网HR经验，曾任职于BAT等知名企业，对各大厂招聘流程和标准了如指掌。已帮助200+学生成功入职大厂，擅长非名校学生的求职规划和能力提升。'
            },
            relatedCases: [
                {
                    id: 'case2',
                    title: '从校园到华尔街 - 李明的金融大厂求职之路',
                    image: 'https://images.pexels.com/photos/7235683/pexels-photo-7235683.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
                    result: '入职高盛投行部门'
                },
                {
                    id: 'case3',
                    title: '从普通教师到教学主管 - 张颖的教育行业晋升之路',
                    image: 'https://images.pexels.com/photos/8423046/pexels-photo-8423046.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
                    result: '晋升为教学主管'
                }
            ]
        },
        'case2': {
            id: 'case2',
            title: '从校园到华尔街 - 李明的金融大厂求职之路',
            date: '2023-04-20',
            views: 1243,
            user: {
                name: '李明',
                background: '金融专业',
                avatar: 'https://images.pexels.com/photos/733872/pexels-photo-733872.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
                tag: '从校园到华尔街'
            },
            results: {
                achievement: '入职高盛投行部门',
                salary: '+60%'
            },
            content: `作为一名普通财经大学的金融专业学生，我一直梦想能够进入华尔街的投行工作。但国际大行的招聘竞争异常激烈，简历关就筛掉了99%的申请者。

在一次校友分享会上，我认识了王静老师，她曾在高盛工作多年，对金融行业的招聘有深入了解。在她的建议下，我开始了为期3个月的系统性准备。

王老师帮助我规划了金融行业的职业路径，从简历包装、专业知识巩固到案例分析训练，每一步都做了精心的准备。最终，我成功通过了高盛的多轮面试，现在已经正式入职投行部门，实现了从校园到华尔街的跨越。`,
            process: [
                {
                    title: '行业背景解析',
                    description: '王老师详细讲解了金融行业的发展趋势和各细分领域的特点，帮助我明确了方向。'
                },
                {
                    title: '简历专业包装',
                    description: '针对投行招聘要求，王老师帮我重新梳理了学习经历和实习经验，突出了分析能力和专业素养。'
                },
                {
                    title: '案例分析训练',
                    description: '通过多个真实案例的分析训练，提升了我的商业思维和问题解决能力。'
                },
                {
                    title: '模拟面试演练',
                    description: '王老师邀请行业内朋友进行了多次模拟面试，让我熟悉了投行面试的各种问题类型和回答技巧。'
                },
                {
                    title: 'Offer选择建议',
                    description: '最终收到多份offer后，王老师从长远发展角度给了我客观的建议，帮助我做出了最佳选择。'
                }
            ],
            advice: [
                {
                    title: '专业知识与实践并重',
                    description: '金融行业重视专业知识，但更看重实际应用能力。王老师指导我将书本知识应用到实际案例中，大大提升了面试竞争力。'
                },
                {
                    title: '建立行业人脉网络',
                    description: '王老师帮助我参加了多个行业交流活动，建立了初步的人脉网络，这对我的求职和未来发展都有很大帮助。'
                },
                {
                    title: '保持专业自信',
                    description: '面对国际大行的面试官，保持专业自信很重要。通过充分准备和模拟训练，我克服了面试紧张，展现出了专业自信的一面。'
                }
            ],
            agent: {
                id: 'agent2',
                name: '王静',
                title: '资深金融顾问',
                avatar: 'https://images.pexels.com/photos/5393594/pexels-photo-5393594.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
                description: '毕业于哈佛商学院，曾在高盛工作10年，擅长投行求职指导和职业规划，帮助150+学生成功入职国内外顶级金融机构。对金融行业的招聘流程和要求有深入了解，能够提供精准的求职建议。'
            },
            relatedCases: [
                {
                    id: 'case1',
                    title: '从二本院校到BAT大厂 - 小王的求职逆袭',
                    image: 'https://images.pexels.com/photos/7988086/pexels-photo-7988086.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
                    result: '成功入职字节跳动'
                },
                {
                    id: 'case3',
                    title: '从普通教师到教学主管 - 张颖的教育行业晋升之路',
                    image: 'https://images.pexels.com/photos/8423046/pexels-photo-8423046.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
                    result: '晋升为教学主管'
                }
            ]
        },
        'case3': {
            id: 'case3',
            title: '从普通教师到教学主管 - 张颖的教育行业晋升之路',
            date: '2023-03-10',
            views: 956,
            user: {
                name: '张颖',
                background: '教育专业',
                avatar: 'https://images.pexels.com/photos/1181686/pexels-photo-1181686.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
                tag: '从普通老师到教学主管'
            },
            results: {
                achievement: '晋升为教学主管',
                salary: '+25%'
            },
            content: `作为一名普通教师，我在教育行业工作了三年，虽然教学能力不断提升，但一直未能获得职位上的突破。我希望能在教育管理方向有所发展，但缺乏相关经验和方法。

通过同事推荐，我找到了刘芳老师，她是教育行业的资深顾问。在初次咨询中，刘老师帮我分析了自身优势与不足，并制定了教育管理能力提升计划。

在刘老师的指导下，我开始系统学习课程设计和团队管理技能，并在工作中有意识地承担一些管理性质的任务。四个月后，我参与了学校教学主管的竞聘，成功获得了晋升，薪资提升了25%，更重要的是开启了教育管理的职业新篇章。`,
            process: [
                {
                    title: '职业定位分析',
                    description: '刘老师帮我明确了教育管理的职业发展路径，找到了自身优势与目标岗位的匹配点。'
                },
                {
                    title: '能力差距识别',
                    description: '通过深入分析，找出了我在课程设计、团队管理、数据分析等方面的能力差距。'
                },
                {
                    title: '管理能力培养',
                    description: '刘老师推荐了针对性的学习资源，并指导我在日常工作中逐步承担管理职责，积累实战经验。'
                },
                {
                    title: '教研成果产出',
                    description: '在刘老师的指导下，我完成了一套创新教学方案，并在校内推广取得了良好效果，提升了个人影响力。'
                },
                {
                    title: '面试策略指导',
                    description: '竞聘前，刘老师针对教学主管的岗位要求，为我做了详细的面试准备，帮助我在竞聘中脱颖而出。'
                }
            ],
            advice: [
                {
                    title: '找准行业价值点',
                    description: '教育行业的晋升不仅看教学能力，更看重对教育本质的理解和创新能力。刘老师帮我找准了能为学校创造的独特价值。'
                },
                {
                    title: '从执行者到管理者的转变',
                    description: '教师晋升管理岗位需要思维方式的转变。刘老师通过实际案例帮我理解了管理者的角色定位和工作方法。'
                },
                {
                    title: '用数据说话',
                    description: '教育效果难以量化是很多老师的困扰。刘老师教会了我如何收集和分析教学数据，用客观结果证明自己的教学和管理能力。'
                }
            ],
            agent: {
                id: 'agent4',
                name: '刘芳',
                title: '教育行业顾问',
                avatar: 'https://images.pexels.com/photos/762020/pexels-photo-762020.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
                description: '拥有15年教育行业经验，曾任国际学校教学总监，现为多家教育机构提供职业发展咨询。帮助100+教育工作者实现职业晋升和转型，擅长教育管理能力培养和教师职业规划。'
            },
            relatedCases: [
                {
                    id: 'case1',
                    title: '从二本院校到BAT大厂 - 小王的求职逆袭',
                    image: 'https://images.pexels.com/photos/7988086/pexels-photo-7988086.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
                    result: '成功入职字节跳动'
                },
                {
                    id: 'case2',
                    title: '从校园到华尔街 - 李明的金融大厂求职之路',
                    image: 'https://images.pexels.com/photos/7235683/pexels-photo-7235683.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
                    result: '入职高盛投行部门'
                }
            ]
        }
    };
    
    return casesData[caseId];
}

// 渲染案例详情
function renderCaseDetail(caseData) {
    const contentContainer = document.getElementById('case-content');
    
    // 清空加载提示
    contentContainer.innerHTML = '';
    
    // 创建页面内容
    let content = `
        <div class="case-header fade-in">
            <h1 class="case-title">${caseData.title}</h1>
            <div class="case-meta">
                <div class="meta-item">
                    <i class="bi bi-calendar3"></i>
                    <span>${caseData.date}</span>
                </div>
                <div class="meta-item">
                    <i class="bi bi-eye"></i>
                    <span>${caseData.views} 浏览</span>
                </div>
            </div>
        </div>

        <div class="user-info fade-in">
            <img src="${caseData.user.avatar}" alt="${caseData.user.name}" class="user-avatar">
            <div class="user-details">
                <h3>${caseData.user.name} | ${caseData.user.background}</h3>
                <p>${caseData.user.tag}</p>
            </div>
        </div>

        <div class="case-results fade-in">
            <div class="result-item">
                <h4>提升结果</h4>
                <p>${caseData.results.achievement}</p>
            </div>
            <div class="result-item">
                <h4>薪资涨幅</h4>
                <p>${caseData.results.salary}</p>
            </div>
        </div>

        <h2 class="section-title fade-in">案例背景</h2>
        <div class="case-content fade-in">
            ${caseData.content.split('\n\n').map(paragraph => `<p>${paragraph}</p>`).join('')}
        </div>

        <h2 class="section-title fade-in">提升过程</h2>
        <div class="process-timeline fade-in">
            ${caseData.process.map((item, index) => `
                <div class="timeline-item">
                    <div class="timeline-dot"></div>
                    <div class="timeline-content">
                        <div class="timeline-title">${index + 1}. ${item.title}</div>
                        <div class="timeline-desc">${item.description}</div>
                    </div>
                </div>
            `).join('')}
        </div>

        <h2 class="section-title fade-in">经验与建议</h2>
        <div class="advice-list fade-in">
            ${caseData.advice.map(item => `
                <div class="advice-item">
                    <div class="advice-title">
                        <i class="bi bi-lightbulb"></i>
                        ${item.title}
                    </div>
                    <div class="advice-desc">${item.description}</div>
                </div>
            `).join('')}
        </div>

        <h2 class="section-title fade-in">指导经纪人</h2>
        <div class="agent-info fade-in">
            <div class="agent-header">
                <img src="${caseData.agent.avatar}" alt="${caseData.agent.name}" class="agent-avatar">
                <div class="agent-details">
                    <h3 class="agent-name">${caseData.agent.name}</h3>
                    <p class="agent-title">${caseData.agent.title}</p>
                </div>
            </div>
            <p class="agent-desc">${caseData.agent.description}</p>
            <div class="action-buttons">
                <button class="action-btn view-profile-btn" data-agent-id="${caseData.agent.id}">
                    <i class="bi bi-person"></i>
                    查看主页
                </button>
                <button class="action-btn consult-btn" data-agent-id="${caseData.agent.id}">
                    <i class="bi bi-chat-dots"></i>
                    预约咨询
                </button>
            </div>
        </div>

        <h2 class="section-title fade-in">相关案例</h2>
        <div class="related-cases fade-in">
            <div class="case-grid">
                ${caseData.relatedCases.map(relatedCase => `
                    <div class="case-card" data-case-id="${relatedCase.id}">
                        <div class="case-card-img">
                            <img src="${relatedCase.image}" alt="${relatedCase.title}">
                        </div>
                        <div class="case-card-content">
                            <h3 class="case-card-title">${relatedCase.title}</h3>
                            <p class="case-card-result">${relatedCase.result}</p>
                        </div>
                    </div>
                `).join('')}
            </div>
        </div>
    `;
    
    // 添加内容到页面
    contentContainer.innerHTML = content;
}

// 初始化页面交互
function initPageInteractions() {
    // 使用事件委托处理所有可能的交互
    document.addEventListener('click', function(e) {
        // 处理查看经纪人主页按钮
        if (e.target.classList.contains('view-profile-btn') || e.target.closest('.view-profile-btn')) {
            const button = e.target.classList.contains('view-profile-btn') ? e.target : e.target.closest('.view-profile-btn');
            const agentId = button.getAttribute('data-agent-id');
            
            if (agentId) {
                window.location.href = `agent-detail.html?id=${agentId}`;
            }
        }
        
        // 处理预约咨询按钮
        if (e.target.classList.contains('consult-btn') || e.target.closest('.consult-btn')) {
            const button = e.target.classList.contains('consult-btn') ? e.target : e.target.closest('.consult-btn');
            const agentId = button.getAttribute('data-agent-id');
            
            if (agentId) {
                // 显示预约成功提示
                showToast('预约成功，稍后会有客服联系您');
                
                // 修改按钮状态
                button.innerHTML = '<i class="bi bi-check-circle"></i> 已预约';
                button.disabled = true;
                button.style.backgroundColor = '#999';
            }
        }
        
        // 处理相关案例点击
        if (e.target.closest('.case-card')) {
            const card = e.target.closest('.case-card');
            const caseId = card.getAttribute('data-case-id');
            
            if (caseId) {
                window.location.href = `case-detail.html?id=${caseId}`;
            }
        }
    });
}

// 显示错误信息
function showError(message) {
    const contentContainer = document.getElementById('case-content');
    contentContainer.innerHTML = `
        <div class="error-container" style="text-align: center; padding: 40px 20px;">
            <i class="bi bi-exclamation-triangle" style="font-size: 40px; color: #ff6b6b; margin-bottom: 20px;"></i>
            <p style="font-size: 16px; color: #666;">${message}</p>
            <button onclick="window.history.back()" style="margin-top: 20px; padding: 8px 20px; background-color: var(--primary-color); color: white; border: none; border-radius: 20px; cursor: pointer;">返回上一页</button>
        </div>
    `;
}

// 显示提示消息
function showToast(message) {
    // 创建提示框元素
    const toast = document.createElement('div');
    toast.className = 'toast';
    toast.textContent = message;
    
    // 设置提示框样式
    toast.style.position = 'fixed';
    toast.style.top = '60px';
    toast.style.left = '50%';
    toast.style.transform = 'translateX(-50%)';
    toast.style.padding = '8px 16px';
    toast.style.backgroundColor = 'rgba(0, 0, 0, 0.7)';
    toast.style.color = '#fff';
    toast.style.borderRadius = '4px';
    toast.style.zIndex = '1000';
    toast.style.opacity = '0';
    toast.style.transition = 'opacity 0.3s ease';
    
    // 将提示框添加到body
    document.body.appendChild(toast);
    
    // 显示提示框
    setTimeout(() => {
        toast.style.opacity = '1';
    }, 10);
    
    // 2秒后隐藏并移除提示框
    setTimeout(() => {
        toast.style.opacity = '0';
        setTimeout(() => {
            document.body.removeChild(toast);
        }, 300);
    }, 2000);
} 